<template>
    <div class="sidebar">
        <handle-card v-motion-slide-rigth title="sidebar.category" moreURL="/category" :cardList="categoryList"></handle-card>
        <handle-card v-motion-slide-rigth title="sidebar.user" moreURL="/user" :cardList="userList"></handle-card>
        <handle-card v-motion-slide-rigth title="sidebar.special" moreURL="/special" :cardList="specialList"></handle-card>
    </div>
</template>

<script setup>
import { ref, getCurrentInstance } from 'vue'
import HandleCard from '@/components/handle-card.vue';
const { proxy } = getCurrentInstance();
const api = {
    loadCategory: "/view/loadCategory",
    loadUser: "/view/loadTeamUser",
    loacSpecial: "/view/loadSpecial"
};

//分类
const categoryList = ref([]);
const loacCategoryList = async () => {
    let result = await proxy._request({
        url: api.loadCategory,
        params: {
            pageSize: 5,
        },
    });
    if (!result) {
        return;
    }
    categoryList.value = result.data.map(v => {
        return {
            cover: proxy.globalInfo.imageUrl + v.cover,
            name: v.categoryName,
            count: v.blogCount,
            url: '/category/' + v.categoryId
        }
    });
};
loacCategoryList();

//博客成员
const userList = ref([]);
const loacUserList = async () => {
    let result = await proxy._request({
        url: api.loadUser,
        params: {
            pageSize: 5,
        },
    });
    if (!result) {
        return;
    }
    userList.value = result.data.map(v => {
        return {
            cover: proxy.globalInfo.imageUrl + v.avatar,
            name: v.nickName,
            count: v.blogCount,
            url: '/user'
        }
    });
};
loacUserList();

//专题
const specialList = ref([]);
const loacSpecialList = async () => {
    let result = await proxy._request({
        url: api.loacSpecial,
        params: {
            pageNo: 1,
            pageSize: 5,
        },
    });
    if (!result) {
        return;
    }
    specialList.value = result.data.list.map(v => {
        return {
            cover: proxy.globalInfo.imageUrl + v.cover,
            name: v.categoryName,
            count: v.blogCount,
            url: '/special/' + v.categoryId
        }
    });
};
loacSpecialList();
</script>

<style lang="scss" scoped>
.sidebar {
    width: 300px;
    padding-top: 20px;
}
</style>